<template>
    <div class="topBar">
        <div class="item-container">

            <div class="item">
                <div class="item-title">
                    管理面积
                </div>
                <div class="item-content">
                    0&nbsp;m<sup>2</sup>
                </div>
            </div>
            <div class="item">
                <div class="item-title">
                    可招商面积 
                </div>
                <div class="item-content">
                    0&nbsp;m<sup>2</sup>
                </div>
            </div>
            <div class="item">
                <div class="item-title">
                    可招商占比

                </div>
                <div class="item-content">
                    0&nbsp;%
                </div>
            </div>
            <div class="item">
                <div class="item-title">
                    总房源数量

                </div>
                <div class="item-content">
                    134&nbsp;间
                </div>
            </div>
            <div class="item">
                <div class="item-title">
                    可招商房源数量
                </div>
                <div class="item-content">
                    0&nbsp;间
                </div>
            </div>
        </div>

    </div>
</template>
<script >

</script>
<style lang="less" scoped>
.topBar{
    background-color: #fff;
    padding: 20px;
    border-radius: 3px;
    display: flex;
    align-items: center;
    .item-container{
        width: 80%;
            display: flex;
            justify-content: space-between;
        .item{
            
            
            .item-title{
                color: #929292;
                font-size: 14px;
    
            }
            .item-content{
                margin-top: 20px;
                font-size: 20px;
    
    
            }
        }
    }
    

}
</style>